<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>02_数据代理_vue</title>
</head>
<body>

<div id="test"></div>

<script src="./js/vue.js"></script>
<script>
  const vm = new Vue({
    data: {
      name: 'tom'
    }
  })
  console.log(vm)

  console.log(vm._data.name) // 不利用代理
  console.log(vm.name) // tom  代理读

  vm._data.name = 'jack' // 不用代理
  vm.name = 'jack' // 代理写

  // 数据代理: 
  // 通过一个对象(vm)代理另一个对象(data)的读写操作
  // vm是代理对象, data是被被代理对象, 数据就在被代理对象内部
  // 作用: 简化对data中数据的读写操作

  // 中介(vm)  房东(data)   房子(属性数据)

</script>
</body>
</html>